<template>
<div>
	<div class="released" v-show="this.mostlist.length!=0 && this.coming.length!=0">
		<most-expected :mostlist="mostlist"></most-expected>
		<be-reflected :coming="coming"></be-reflected>
	</div>
	<!-- loading -->
    <van-loading size="30px"  v-show="this.mostlist.length==0 && this.coming.length==0" color="#f03d37">加载中...</van-loading>
</div>
</template>

<script>
import MostExpected from '@/components/MostExpected.vue'
import BeReflected from '@/components/BeReflected.vue'
export default {
	components: {
		MostExpected,
		BeReflected,
	},
	data(){
		return{
			coming: [],
			mostlist: [],
		}
	},
	created() {
		this.getBeList();
		this.getExpectedList()
	},
	methods: {
		async getBeList() {
			let res = await this.axios.get("index/comingList?ci=1&limit=10");
			// console.log(res);
			this.coming = res.coming;
		},
		async getExpectedList() {
			let re = await this.$axios.get('index/mostExpected?ci=20&limit=30&offset=0')
			
			this.mostlist = re.coming
			// console.log(this.mostlist)
		}
	},
}
</script>

<style scoped lang="less">
/deep/ .van-loading{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
}
.released {
	margin-top: 96px;
	margin-bottom: 48px;
}
</style>
